<template>
  <div>
    <div class="Logout">
      <Logout>退出</Logout>
    </div>
    <h1>更新教师信息</h1>
    <el-input size="medium" v-model="user.tno" placeholder="请输入教师编号"></el-input>
    <el-button @click="search()" icon="el-icon-search" circle></el-button>
    <el-table  v-if="tableData"
      :data="tableData"
      border
      style="width: 100%">
      <template slot="empty" >
        <span style="font-size: 20px"></span>
      </template>
      <el-table-column
        prop="tno"
        label="教师编号"
        width="120">
      </el-table-column>
      <el-table-column
        prop="tname"
        label="教师姓名"
        width="120">
      </el-table-column>
      <el-table-column
        prop="tlevel"
        label="教师等级"
        width="120">
      </el-table-column>
      <el-table-column
        prop="tcharacter"
        label="教师特长"
        width="120">
      </el-table-column>
      <el-table-column
        label="操作"
        width="120">
        <template slot-scope="scope">
          <el-button @click="handleClick(scope.row)" type="text" size="small">修改</el-button>
          <el-button @click="delTeacher(scope.row)"  type="text" size="small">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import Logout from "./Logout";
export default {
  name: "EditTeacher",
  components:{Logout},
  created() {
    let  _this = this;
    console.log("即将打印全体教师")
    this.$axios.post(`/ShowTeacher`).then((res) => {
      console.log(res.data);
      this.tableData = res.data;
      this.sta = true
      console.log("全部数据：", this.tableData)
    })
  },
  methods : {
    search(){
      let  _this = this;
      const parms = {
        tno: '',
        tname: '',
        tlevel: '',
        tcharacter: '',
      }
      this.sta = false


      this.$axios.post(`/ShowTeacherSelect`, {...this.user}).then((res) => {
        console.log(res.data);
        _this.tableData = res.date
        this.sta = true

        console.log("找到的老师：", _this.tableData)
        //_this.tableData = String(res.data);//请求来的是对象，但是tableDate是数组类型
        //   _this.tableData += res.data.tno
        //   _this.tableData += res.date.tname
        //   _this.tableData += res.date.tlever
        //   _this.tableData += res.date.tcharacter
      })
    },
    handleClick(row) {
      console.log(row);
      const tno = row.tno;
      this.$router.push({path:'/UpdateTeacher',query:{
          tno:tno,
          tname:row.tname,
          tlevel:row.tlever,
          tcharacter:row.tcharacter

        }});
    },
    delTeacher(row) {
      console.log(row);
      const tno = row.tno;
      const  _this = this;
      this.$axios.get(`/ShowTeacherDelete`).then((res) => {
        alert("删除成功");
        this.$axios.get(`/teacher/list?tno=${this.search_tno}`).then((res) => {
          console.log(res.data);
          _this.tableData = res.data;

        })

      })
    },
  },
  data () {
    return {
      user:{
        tno:this.search_tno,
        tname:'',
        tlevel:'',
        tcharacter:'',
      },
      sta:false,
      search_tno:'',
      tableData: null
    }
  }
}
</script>

<style scoped>

</style>
